上位机开发笔记 » 搜索 » user:admin post:true

记录下自己零基础学习htmlayout的过程

不推荐使用 , 推荐看12楼方法

刚才又到论坛里看了下, 弹出dropdown,官方推荐用 popup-menu ,这个是htmlayout内置的behavior,不需要导入其他库

htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

不推荐使用 , 推荐看12楼方法

上面有一个问题, 弹出来之后, 必须点击弹出区域外才能关闭弹出口, 在里面点击不会关闭

em.... aar官方论坛里有提到了,

htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

不推荐使用 , 推荐看12楼方法

3, 模拟菜单栏的弹出菜单功能

类似winform的菜单, 点击后,下拉出一个列表 ,

<div style="behavior:dropdown">菜单演示 <popup>          <li>新
htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

上面的方法只能简单的提示 , 如果你想要用要给复杂漂亮的提示框, 那么可以指定提示用的titleid,这个titleid指向下面定义的popup的id号即可.

<div #hello1 style="behavior:button" titleid="mytips1">hello aardio1111!</div> <br /> <div #hello2 style="behavior:button" titleid="mytips1">hel
htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

2, 增加提示

上面按键上怎么增加提示功能? 类似winform里的tooltips

第一种最简便的办法, 在div里面增加title属性, 这样htmlayout自动管理提示

<div #hello1 style="behavior:button" ti
htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

其实上写到这里就可以看出, 上面利用onbuttonClick事件和press是不对的, 貌似实现了, 但是会有很多问题, 要实现长按功能, 就应该用类似plus的mouseup和mousedown事件

但是从教程里来看如果html里设置behavior:button定义为button, 那么就不会产生mouseup事件了, 经过测试也确实如此, 

onMouseUp 和onMouseDown 事件是针对普通的节点, 官方论坛里也说过:

htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

我们知道工业上很多时候需要长按按钮来实现一定的功能, 比如数值连续增加, 那么这里应该怎么实现呢?

var i=1; wbLayout.onButtonPress = { hello1 = function (ltTarget,ltOwner,reason,behaviorParams) { console.log(i) i++; } }

增加press功能, 这样鼠标在按钮上长按,就应该会数值自动增加了.

htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

如果按照上面的写法,每次判定if() 把所有的逻辑写在一起总感觉看着不是很合逻辑, 那么aardio里提供了另外一种写法, 类似写函数那样写成表函数的形式

123
htmlayout admin •  2019-10-27 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

上面只是用到了一个button , 如果有两个

<div style="behavior:button">hello aardio1111!</div> <br /> <div style="behavior:button">hello aardio2222!</div>

那么点击任何一个都会弹出窗口, 这显然不是我要的, 

我要知道我点击了谁, 然后弹出不同的窗口.

那么需要在逻辑代码里输出看

htmlayout admin •  2019-10-26 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

界面最重要的就是交互, 那么怎么才能我点击 hello aardio的字时候,弹出这个信息呢?

<div style="behavior:button">hello aardio!</div>

我们看了aardio官方教程知道, 有这么个交互behavior行为, 只需要定义代码块为这个button行为,那么点击它就会产生button的行为了.

于是,我们在main.aardio逻辑代码里添加

htmlayout admin •  2019-10-26 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

1 , 新建htmlayout工程

首先建立 ui.aardio 的代码文件, 代码框架如下

<html> <head> <style type="text/css"> </style> </head> <body> hello aardio! </body> </html>

那么,修改和添加main.aardio 

htmlayout admin •  2019-10-26 • 最后回复来自 coolee
30

记录下自己零基础学习htmlayout的过程

以前说了N多次要学习下htmlayout , 一直各种理由没开始, 这次下定决心开始好好的学一学.

为什么选择htmlayout? 不是过时了吗?

我不这样认为, 适合自己的才是最好的, 最先进的技术并不一定适合我, 我目前的工作和生活中winform这样的拖拖拽拽都可以胜任 , 接触更多的是工业级的软件, 不像web那样的应用层, 工业级的设计讲究的是效率和稳定. 

适不适合还是因人而异.  ,哈


既然名字都包含了html那么需要的就是html的语法了, 我从来没弄过web方面的, 所以真的是白的不能再白

htmlayout admin •  2019-10-26 • 最后回复来自 coolee
30

异形按钮的实现方法(例如:斜角按钮,星形按钮)

回复#1 @jacen :

感谢jacen提供tabs的方法,非常好用

aardio ui admin •  2019-10-26 • 最后回复来自 jacen
10

异形按钮的实现方法(例如:斜角按钮,星形按钮)


2019-10-26更新:

作者jacen在新版里增加了win.region.png库, 另外在updateWindow()函数里增加了第三个参数来保存之前生成的region区域, 这样利用这个库, 代码就可以更简洁了

aardio ui admin •  2019-10-24 • 最后回复来自 jacen
10

plus控件改变文本的颜色

更新: 2019-10-22 一鹤jacen改进了plus控件的color属性,

运行时修改color属性如果启用了编辑属性可同步修改内部编辑框字体颜色

可以很方便的修改plus的文本色了.

使用以下代码请升级到aardio最新版本



之前都是用skin() 来设置颜色, 但是这个的颜色只是和鼠标的各种交互用的.

这次突然用到直接修改颜色,  特此记录一下

aardio admin •  2019-10-21 • 最后回复来自 jacen
1

ST-curve波形图ocx控件的试用

波形图的简单应用示例:

这个页面创建波形, 其他界面传递参数来添加数据或者清空图形

import win.ui; /*DSG{{*/ var winform = win.form(text="aardio form";right=759;bottom=469) winform.add() /*}}*/ import thread.command; /*初始化波形图外形{{*/ var stc = winform.createEmbed("{315E7F0E-6F9C-41A3-A669-A7E
aardio 波形图 ocx admin •  2019-10-18 • 最后回复来自 admin
7

layui做界面在aardio中使用交互学习

回复#6 @dsp2138 :

不理解你到底想做啥? 什么叫主动?

你的意思是,网页html里主动调用aar?

网页里如果你不去手动点, 想要它自己主动调用aar, 那么你就在html里加个定时器,或者网页代码里加while , 里面循环判定执行啥啥的.

js是单线程的, 你难道还想要它跑多线程?


推荐你去aar的C大大的社区提问, bbs.aardio.org

aardio web ui admin •  2019-10-14 • 最后回复来自 admin
7

layui做界面在aardio中使用交互学习

回复#3 @dsp2138 :

追加一点提示, 你可以再aar文件里追加网页中的js函数, 然后就想给谁交互就和谁了



aardio web ui admin •  2019-10-11 • 最后回复来自 admin
7

layui做界面在aardio中使用交互学习

回复#3 @dsp2138 :

上面不是说了吗 用wb.external

就如你所问:

你想让网页获取变量,main.aardio里定义

wb.external = {     get变量a = function(){         return mainform.edit.text;     }; }

然后网页里用js获取,用external.get变量a()

aardio web ui admin •  2019-10-11 • 最后回复来自 admin
7

aardio自定义控件一例

感谢 indertust 提供的示例代码

自定义控件可以方便的把一系列的功能封装到一个控件, 这样使用的时候就不需要繁杂的复制黏贴修改了,更方便管理。

例如下面是把采集到的模拟数据显示在界面上, 通道有8个,如果按照常规写法需要拖动很多个控件来实现,封装为一个控件之后只需要业务逻辑即可。

自定义的 analogchannelex.aardi

aardio admin •  2019-10-07 • 最后回复来自 zhlzhang
5
登 录
信息栏
本站域名

ChengXu.XYZ

投诉联系:  popdes@126.com



快速上位机开发学习,本站主要记录了学习过程中遇到的问题和解决办法及上位机代码分享

这里主要专注于学习交流和经验分享.
纯私人站,当笔记本用的,学到哪写到哪.
如果侵权,联系 Popdes@126.com

友情链接
Aardio官方
Aardio资源网


才仁机械


网站地图SiteMap